$swiperHeight: 407px;
$swiperWidth: 707px;
$borderRadius20: 20px;
$borderRadius10: 10px;
$defaultFontSize: 29px;
$defaultColor: #ffb72f;
.nav-top-center {
  position: fixed;
  top: 0;
  z-index: 1;
  transition: all linear 0.2s;
}
.transparentBg {
  background-color: transparent !important;
}
.whiteBg {
  background-color: white !important;
}
.common-nav {
  background-color: transparent !important;
}

//.fade-in-top {
//// 收缩
//  overflow: hidden;
//  transition: height 0.5s ease-out;
//  -webkit-transform: max-height 0.5s ease-out;
//  max-height: 0;
//  height: 0;
//}
//.slide-out-top {
//// 展开
//  max-height: 3000px;  // 尽可能大 不过满足最大高度即可
//  transition: max-height 0.5s ease-in;
//  -webkit-transform: max-height 0.5s ease-in;
//}

.shop-info {
  //transition: all 2s  ease-in;
}
.maxHeight {
  height: calc(95vh - 88px) !important;
  overflow: hidden;
}
.sp-reservation-home {
  background-color: white;
  height: calc(100vh);
  overflow: hidden;
  position: relative;
  //padding-bottom: env(safe-area-inset-bottom);
  font-size: 29px;
  &-close {
    width: 100vw;
    position: fixed;
    bottom: calc(env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
    background-color: #fee9b1;
    color: #ffb72f;
    padding: 19px 0;
    text-align: center;
  }
  &-nav-tabs {
    background-color: white;
    padding-bottom: 10px;
    margin-top: 20px;
    &-tabs {
      display: flex;
      align-items: center;
      background-color: white;
    }
    &_fixed {
      position: fixed;
      background-color: white;
      width: 100vw;
      z-index: 2;
      transition: all 0.3s linear 0s;
    }
    &-tab {
      flex: 1;
      text-align: center;
      background-color: white;
      text {
        padding: 15px 0;
      }
    }
    &-tab_actived {
      border-bottom: 5px solid $defaultColor;
    }
    /*城市选择和搜索框*/
    &-search-nav {
      margin: 35px auto;
      position: relative;
      width: 707px;
      height: 88px;
      background: #f5f5f5;
      border-radius: 44px;
      box-sizing: border-box;
      border: 1px solid #f5f5f5;
      display: flex;
      font-size: $defaultFontSize;
      align-items: center;
      //padding: 0 15px;
      .search-input {
        width: 686px;
        padding: 0 14px;
        height: 100%;
        border-radius: 44px;
        font-size: $defaultFontSize;
        font-weight: 400;
        color: rgba(163, 163, 163, 1);
      }
      .input-hold {
        //hold默认显示的标题
        //position: absolute;
        //top: 50%;
        //left: 10%;
        //transform: translate(-10%, -50%);
        margin-left: 21px;
        z-index: 10;
        .rt-icon {
          width: 27px;
          height: 27px;
        }
        ._h3 {
          width: 200px;
          margin-left: 14px;
          font-size: $defaultFontSize;
          color: #3d3d3d;
          opacity: 0.4;
          line-height: 19px;
        }
      }
    }
  }
}
.emptyBox {
  text-align: center;
  background-color: white;
  height: 50vh;
  .icon-empty {
    width: 350px;
    height: 300px;
    margin-left: 50%;
    transform: translateX(-50%);
  }
}
.shop-state-cover {
  width: 100vw;
  height: 100vh;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.3);
  top: 0;
  display: flex;
  justify-content: center;
  z-index: 999;
  .shop-off-png {
    width: 350px;
    height: 450px;
    opacity: 1;
    position: relative;
    top: calc($swiperHeight + 100px);
  }
  .shop-close-png {
    width: 50px;
    height: 50px;
    position: relative;
    top: calc($swiperHeight + 600px);
    left: -200px;
  }
}
.shop_off {
  height: 100vh;
  overflow: hidden;
}
